<template>
    <LModalForm 
        :visible="visible"
        :confirmLoading="confirmLoading" 
        :title="title" 
        :width="600"
        ref="templateDetailForm" 
        :formAttributes="formAttributes" 
        @handleOk="handleOk" 
        @handleCancel="handleCancel"
        @clickEventHandler="clickEventHandler"
        @changeEventHandler="changeEventHandler">
    </LModalForm>

</template>

<script>
import LModalForm from "@/components/lt/form/LModalForm"
import pick from 'lodash.pick'
import request from '@/utils/request'
import defaultSettings from '@/config/defaultSettings'

export default {
    name:'templateDetailForm',
    components:{
        LModalForm
    },
    props:{
        templateDetailList:{
            type:Object,
            required:true
        },
    },
    data(){
        return{
           defaultSettings,
            title:'详情',
            visible:false,
            confirmLoading: false,
            model:{},
            formAttributes:{
              type:'',//collapse,tabs
              formItems:[
                {
                  title:'标签一',
                  columns:1,
                  fields:[
                    {field:'dbField',label:'数据库字段名',component:'input',disabled:true,rules: [{required: true, message: '请输入数据库字段名'}]},
                    {field:'fieldName',label:'实体字段名',component:'input',rules: [{required: true, message: '请输入字段名'}]},
                    {field:'fieldTitle',label:'字段标题',component:'input',rules: [{required: true, message: '请输入字段标题'}]},
                    {field:'fieldType',label:'字段类型',component:'input',disabled:true,rules: [{required: true, message: '请输入字段标题'}]},
                    {field:'dictCode',label:'下拉数据源',component:'input'},
                    {field:'itemText',label:'下拉标题字段',component:'input',hide:true,initialValue:"itemText"},
                    {field:'itemValue',label:'下拉值字段',component:'input',hide:true,initialValue:"itemValue"},
                    {field:'dateFormat',label:'日期格式化',component:'select',hide:true,dictCode:defaultSettings.数据字典.日期格式化},
                    {field:'fieldOrder',label:'字段排序',component:'inputNumber',rules: [{required: true, message: '请输入字段排序'}]},
                    {field:'isImport',label:'是否模板字段',component:'select',dictCode:defaultSettings.数据字典.是否,initialValue:'1',rules: [{required: true, message: '请选择是否导入'}]},
                 ]
                },
              ]

            }


        }
    },
    methods:{
       
        edit (record) {
            this.visible = true;
            
            if(record['fieldType'].indexOf("Date")>=0){
                this.dateFormatHide(false)
                this.dictInfoIsHide(true);
            }else if(record['dictCode']!=null && record['dictCode']!=""){
                this.dictInfoIsHide(false);
            }else{
                this.dictInfoIsHide(true);
                this.dateFormatHide(true)
            }
            this.model = Object.assign({}, record);
            this.$nextTick(() => {
                this.$refs.templateDetailForm.getForm().setFieldsValue(pick(this.model,'dbField','fieldName','fieldTitle','dictCode','fieldOrder','itemText','itemValue','dateFormat','fieldType','isImport'))
            })
        },
        handleOk(){
            const that = this;
            this.$refs.templateDetailForm.getForm().validateFields((err, values) => {
                if (!err) {
                    that.confirmLoading = true
                    let formData = Object.assign(this.model, values);
                    //判断是否有重复数据
                    let detailArr = that.templateDetailList.$refs.templateDetailList.localDataSource
                    if(detailArr.length>0){
                        var repeated = detailArr.filter(function(item) { 
                            return (item.fieldName=== formData.fieldName || item.fieldTitle=== formData.fieldTitle || item.fieldOrder=== formData.fieldOrder)
                        });
                       
                    }
                    if(formData.keyId){
                        if(repeated.length>1){
                            that.$message.success("字段标题、名称、排序不能重复");
                            that.confirmLoading = false;
                            return
                        }
                    }else {
                        if(repeated.length>0){
                            that.$message.success("字段标题、名称、排序不能重复");
                            that.confirmLoading = false;
                            return
                        }
                    }
                    request({url: '/SysImportTemplateDetailController/save',method: 'post',data: formData}).then((res)=>{
                        if(res.success){
                            that.close()
                            that.$message.success(res.message);
                        }else{
                            that.$message.warning(res.message);
                        }
                    }).finally(() => {
                        that.confirmLoading = false;
                        
                    })
                    
                }
            })
        },
        handleCancel(){
            this.visible=false
        },
        close () {
            this.$emit('close');
            this.visible = false;
        },
         /**
         * 表单内容发生变化
         */
        changeEventHandler(changeItem){
            if(Object.keys(changeItem)[0]=="dictCode"){
                let dictCodeVal = changeItem['dictCode']
                if(dictCodeVal && dictCodeVal!=null && dictCodeVal!=""){
                    this.dictInfoIsHide(false);
                }else{
                    this.dictInfoIsHide(true);
                   
                }
            }
        },
        clickEventHandler(field,form){
            
        },

        dictInfoIsHide(isHide){
            this.formAttributes.formItems[0].fields[5].hide=isHide;
            this.formAttributes.formItems[0].fields[6].hide=isHide;
            this.formAttributes.formItems[0].fields[6].rules=[{required: !isHide, message: '请输入下拉标题字段'}]
            this.formAttributes.formItems[0].fields[5].rules=[{required: !isHide, message: '请输入下拉值字段'}]
        },
        dateFormatHide(isHide){
            this.formAttributes.formItems[0].fields[4].hide=!isHide;
            this.formAttributes.formItems[0].fields[7].hide=isHide
            this.formAttributes.formItems[0].fields[7].rules=[{required: !isHide, message: '请输入日期格式'}]
        }
    },
    created(){
        
    },
}
</script>